<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>{$data_one.title|htmlspecialchars}</title>
    <link rel="stylesheet" href="__ASSERTS__/css/reset.css?{$Think.const.STATIC_RES_HASH}">
    <link rel="stylesheet" href="__ASSERTS__/mdeditor/css/editormd.preview.css?{$Think.const.STATIC_RES_HASH}">
    <script src="__ASSERTS__/js/jquery-1.11.3__JS_SUFFIX__?{$Think.const.STATIC_RES_HASH}"></script>
    <style>
        body {margin:0;padding:0;background:#F6F6F6;font-family: 'Helvetica Neue',Arial,'Hiragino Sans GB',STHeiti,'Microsoft YaHei','WenQuanYi Micro Hei',SimSun,Song,sans-serif;}
        #main-container{margin:0 auto;width:1000px;background:#FFF;border-radius:10px;}
        #markdown_title{
            font-size:12mm;
            line-height:50px;
            margin: 0 0 0 0;
            width:auto;
            text-align: center;
            color:#2c3f51;
            margin:70mm 20mm 0 20mm;
        }
        #markdown_sidebar{
            padding:20px;
            page-break-after: always;
        }
        #custom_toc_container{
            width:auto;
        }
        #markdown_sidebar h1 {
            margin:0;padding:0;
            font-size: 10mm;
            text-align: center;
            font-weight: bold;
            line-height:30mm;
            color:#999;
            border-bottom:2px solid #CCC;
        }
        #markdown_sidebar .markdown-body *{
            font-size:18px;
            line-height:30px;
        }
        #markdown_view {
            margin: 0;
            width:auto;
        }
        #markdown_view > p{
            font-size:16px !important;
            line-height:25px;
        }
        #print_box{
            cursor:pointer;
            text-align: center;
            line-height:20mm;
            background: #1D97F2;
            color:#FFF;
        }
        #markdown_profile{
            width:40%;
            margin:100mm auto 0 auto;
            page-break-after: always;
        }
        #markdown_profile table{
            width:100%;
            border-bottom:1px solid #CCC;
        }
        #markdown_profile table tr{
            background-color: #fff;
            border-top: 1px solid #ccc;
        }
        #markdown_profile table tr td{
            padding:3mm;
        }
        #markdown_profile table tr td:first-child{
            text-align: right;
            color:#666;
        }
        .editormd-markdown-toc > ul > li {
            margin-bottom: 1em !important;
        }
        #logo img{
            width:100%;
        }
    </style>
    <style type="text/css" media="print">
        @page{
            margin: 20mm;
            size: auto;
        }
        pre,table,.editormd-tex,svg {
            page-break-inside : avoid;
        }
        p{
            orphans:4;
            widows:2;
        }
        #print_box {display:none;}
    </style>
</head>
<body>

<div id="main-container">

    <div id="print_box" onclick="window.print()">
        点击打印生成PDF（推荐使用chrome浏览器，A4打印）
    </div>

    <div id="logo">
        <img src="<?php echo tpx_config_get('docmz_pdf_logo', '__ROOT__/asserts/res/img/pdf_logo.png'); ?>" />
    </div>

    <div id="markdown_title">
        {$data_one.title|htmlspecialchars}
    </div>

    <div id="markdown_profile">
        <table>
            <tr>
                <td>作者：</td>
                <td>{$data_attr.realname|t_html}</td>
            </tr>
            <tr>
                <td>修改：</td>
                <td>{$data_one.update_time|t_date}</td>
            </tr>
            <tr>
                <td>创建：</td>
                <td>{$data_one.add_time|t_date}</td>
            </tr>
        </table>
    </div>

    <div id="markdown_sidebar">
        <h1>目录</h1>
        <div class="markdown-body editormd-preview-container" id="custom_toc_container"></div>
    </div>

    <div id="markdown_view">
        <textarea style="display:none;">{$data_one.content|htmlspecialchars}</textarea>
    </div>
</div>

<script src="__ASSERTS__/mdeditor/lib/marked.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/lib/prettify.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/lib/raphael.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/lib/underscore.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/lib/sequence-diagram.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/lib/flowchart.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/lib/jquery.flowchart.min.js?{$Think.const.STATIC_RES_HASH}"></script>
<script src="__ASSERTS__/mdeditor/editormd.js?{$Think.const.STATIC_RES_HASH}"></script>
<script type="text/javascript">
    $(function () {
        editormd.markdownToHTML("markdown_view", {
            htmlDecode: "style,script,iframe",
            tocContainer: "#custom_toc_container",
            markdownSourceCode: false,
            emoji: true,
            taskList: true,
            tex: true,
            flowChart: true,
            sequenceDiagram: true,
            onload: function(div){
                div.find('.sequence-diagram > svg, .flowchart > svg').each(function(i,o){
                    try{
                        var width = $(o).attr('width'), height = $(o).attr('height');
                        o.setAttribute('viewBox','0 0 '+width+' '+height);
                    }catch(e){}
                });
            }
        });
    });
</script>
</body>
</html>